<template>
	<view>
		<cu-custom bgColor="bg-red" :isBack="true">		<block slot="backText"></block>
			<block slot="content">物流详情</block>
		</cu-custom>
		<block v-if="detail">
			<block v-for="(item,index) in detail.data" :key="index">
				<view class="cu-list menu margin-bottom">
					<view class="cu-item">
						<view class="content">
							快递公司
						</view>
						<view class="action">
							{{item.express_company}}
						</view>
					</view>
					<view class="cu-item">
						<view class="content">
							快递单号
						</view>
						<view class="action">
							{{item.express_no}} <text class="cu-btn sm line-blue round margin-left-sm" @tap="paste(item.express_no)">复制</text>
						</view>
					</view>
				</view>

				<view class="cu-timeline margin-bottom" v-if="item.trace&&item.trace.length>0">
					<view class="cu-item cur " v-for="(info,i) in item.trace" :key="i">
						<view class="content  bg-white">
							<!-- {{$common.timeFormat(info.datetime)}} -->
							{{info.datetime}}
						</view>
						<view class="content  bg-red">
							{{info.remark}}
						</view>
					</view>
				</view>
				
				<view class="cu-timeline" v-else>
					<view class="cu-item cur ">
						<view class="content  bg-white">
							{{$common.timeFormat(item.created_at)}} 已寄出
						</view>
					</view>
				</view>
				
			</block>
		</block>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 0,
				detail: null,
				theme: this.$config.THEME(),
			}
		},
		onLoad(options) {
			this.id = options.id
			if (!this.id) {
				this.$common.showErrorModal('参数有误')
			}
			this.getInfo()
		},
		methods: {
			getInfo() {
				this.$http
					.get('order_express', {
						order_id: this.id
					})
					.then((response) => {
						this.detail = response.data.data
					})
					.catch((response) => {
						uni.hideLoading()
					})
			},
			paste(value) {
				let _this = this
				uni.setClipboardData({
					data: value,
					success() {
						_this.$common.showSuccess('复制成功')
					}
				})
			},
		},
	}
</script>

<style>
</style>
